<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <!--
        移动设备优先配置
        initial-scale=1.0 确保网页加载时，以 1:1 的比例呈现，不会有任何的缩放。
        maximum-scale=1.0 用户无法放大
        user-scalable=no 可以禁用其缩放（zooming）功能。
        通常情况下，maximum-scale=1.0 与 user-scalable=no 一起使用。
    -->
    <meta name="viewport"
          content="width=device-width,
                maximum-scale=1.0,
                initial-scale=1.0">

    <title>登录页</title>
    <link rel="icon" href="/static/image/favicon.png" type="image/png">
    <link rel="stylesheet" href="/static/layui/css/layui.css">
    <script src="/static/js/jquery.min.js"></script>
    <script src="/static/layui/layui.js"></script>
    <style>
        body {
            padding: 0;
            margin: 0;
            font-size: 16px; /* 默认基准值 */
        }

        /* 小屏幕 */
        @media (max-width: 768px) {
            html {
                font-size: 15px;
            }
        }

        /* 大屏幕 */
        @media (min-width: 1200px) {
            html {
                font-size: 17px;
            }
        }

        .container {
            padding-right: 15px;
            padding-left: 15px;
            margin-right: auto;
            margin-left: auto;
            height: 100vh;
            width: 100vw;
        }

    </style>
</head>
<body>
<div class="container" style="display: flex;flex-direction: column">
    <div class="row" style="flex: 0 1 15%;display: flex;align-items: center;">
        <div>
            <h3>Sa-Token学习</h3>
        </div>
    </div>
    <div class="row" style="flex: 0 1 85%;display: flex;align-items: center;justify-content: center;">
        <div style="width: 40%;">
            <form lay-filter="form-login" class="layui-form" onsubmit="return false;">
                <div class="layui-form-item">
                    <label class="layui-form-label">
                        <i class="layui-icon layui-icon-username"></i>
                        用户名
                    </label>
                    <div class="layui-input-block">
                        <input type="text"
                               name="username"
                               lay-verify="required"
                               placeholder="请输入用户名"
                               class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">
                        <i class="layui-icon layui-icon-password"></i>
                        密&nbsp;&nbsp;&nbsp;码
                    </label>
                    <div class="layui-input-block">
                        <input type="password"
                               name="password"
                               lay-verify="required"
                               placeholder="请输入密码"
                               class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <button
                            class="layui-btn layui-btn-fluid"
                            onclick="doLogin()"
                    >
                        登录
                    </button>
                </div>
            </form>
        </div>
    </div>
</div>
</body>
<script>
    let form;
    let layer;
    layui.use(function () {
        form = layui.form;
        layer = layui.layer;
    });

    function doLogin() {
        let field = form.val("form-login");
        $.ajax({
            url: "/user/doLogin",
            dataType: "json",
            method: "post",
            data: field,
            success: function (res) {
                console.log("res", res);
                if (res.code == 200) {
                    // 获取之前保存的重定向 URL
                    var redirectUrl = localStorage.getItem('redirectUrl');
                    if (redirectUrl) {
                        // 有保存的 URL，跳转到该 URL
                        window.location.href = redirectUrl;
                        // 清除保存的 URL
                        localStorage.removeItem('redirectUrl');
                    } else {
                        window.location.href = "/home";
                    }
                } else {
                    layer.alert(res.msg, {
                        title: '警告'
                    });
                }
            },
            error: function (e) {
                alert("请求失败");
                console.log('e', e);
            }
        });
    }
</script>
</html>